<!doctype html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>博客详情</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <link rel="stylesheet" type="text/css" th:href="@{/blog/css/bootstrap.min.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/blog/css/nprogress.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/blog/css/style.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/blog/css/font-awesome.min.css}">
    <link rel="apple-touch-icon-precomposed" th:href="@{/blog/images/icon.png}">
    <link rel="shortcut icon" th:href="@{/blog/images/favicon.ico}">
    <script th:src="@{/blog/js/jquery-2.1.4.min.js}"></script>
    <script th:src="@{/blog/js/nprogress.js}"></script>
    <script th:src="@{/blog/js/jquery.lazyload.min.js}"></script>
</head>

<body class="user-select single">
<header class="header">
    <nav class="navbar navbar-default" id="navbar">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#header-navbar"
                    aria-expanded="false">
                <span class="sr-only"></span> <span class="icon-bar"></span>
                <span class="icon-bar"></span> <span class="icon-bar"></span>
            </button>
        </div>
        <div class="container">
            <div class="collapse navbar-collapse" id="header-navbar">
                <form class="navbar-form visible-xs" th:action="@{/Search}" method="post">
                    <div class="input-group">
                        <input type="text" name="articletitle" class="form-control" placeholder="请输入关键字"
                               maxlength="20" autocomplete="off">
                        <span class="input-group-btn">
								<button class="btn btn-default btn-search" name="search" type="submit">搜索</button>
							</span>
                    </div>
                </form>
                <ul class="nav navbar-nav navbar-right">
                    <li>
                        <a th:href="@{/listBlog}">博客首页</a>
                    </li>
                    <li>
                        <a th:href="@{/createBlog}">我要写作</a>
                    </li>
                    <li>
                        <a th:href="@{/listBlog}">我的信息</a>
                    </li>
                    <li>
                        <a th:href="@{/listBlog}">返回导航页</a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
</header>
<section class="container">
    <div class="content-wrap">
        <div class="content">
            <header class="article-header">
                <h1 class="article-title"><a href="#" th:text="${article.articletitle}">用DTcms做一个独立博客网站（响应式模板）</a></h1>
                <div class="article-meta">
                    <span class="item article-meta-time">
	                     <i class="glyphicon glyphicon-time"></i>
                         <time class="time" data-toggle="tooltip" data-placement="bottom" title="" th:text="${#dates.format(article.articletime,'yyyy-MM-dd')}">
                         2016-10-14
                         </time>
                    </span>
                    <i class="glyphicon glyphicon-list"></i>
                    <span class="item article-meta-category" data-toggle="tooltip" data-placement="bottom">
                            <a href="#" title="IT相关">IT相关</a>
                    </span>
                    <i class="glyphicon glyphicon-eye-open"></i>
                    <span class="item article-meta-views" data-toggle="tooltip" data-placement="bottom" title="">
                        219
                    </span>
                    <i class="glyphicon glyphicon-comment"></i>
                    <span class="item article-meta-comment" data-toggle="tooltip" data-placement="bottom" title="">
                         4
                    </span>
                </div>
            </header>
            <article class="article-content">
                <p><img data-original="images/201610181557196870.jpg" th:src="@{'/images/'+${article.titlephoto}}" width="533px" height="300px"/></p>
                <p th:text="${article.brief}">
                    引导语</p>
                <p th:utext="${article.articlecontent}">博客正文</p>
            </article>
            <div class="article-tags">
                <a href="#list/2/" rel="tag">收藏本文</a>
            </div>

            <div class="title" id="comment">
                <h3>留言</h3>
            </div>
            <div id="respond">
                <form id="comment-form" name="comment-form" th:action="@{/writeComment(articleid=${article.id})}" method="POST">
                    <div class="comment">
                        <div class="comment-box">
                            <textarea placeholder="在这输入您的留言" name="commentcontent" id="comment-textarea"
                                      cols="100%" rows="3" tabindex="3"></textarea>
                            <div class="comment-ctrl">
                                <div class="comment-prompt" style="display: none;">
                                    <i class="fa fa-spin fa-circle-o-notch"></i>
                                    <span class="comment-prompt-text">留言正在提交中...请稍后</span>
                                </div>
                                <div class="comment-success" style="display: none;"><i class="fa fa-check"></i> <span
                                        class="comment-prompt-text">留言提交成功...</span></div>
                                <button type="submit" name="comment" id="comment-submit" tabindex="4" th:action="@{/writeComment(articleid=${article.id})}">留言</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div id="postcomments">
                <ol id="comment_list" class="commentlist"  th:each="commentList:${blogCommentList}">
                        <div class="comment-main">
                            <p>
                                <a class="address" href="#" rel="nofollow" target="_blank" th:text="${commentList.getEduUser().username}">木庄网络博客</a>
                                <span class="time" th:text="${#dates.format(commentList.commenttime,'yyyy-MM-dd hh:mm:ss')}">(2016/10/28 11:41:03)</span>
                                <br th:text="${commentList.commentcontent}">
                            </p>
                        </div>
                    </li>
                </ol>
            </div>
        </div>
    </div>
    <aside class="sidebar">
        <div class="fixed">
            <div class="widget widget-tabs">
                <ul class="nav nav-tabs" role="tablist">
                    <li role="presentation" class="active">
                        <a href="#notice" aria-controls="notice" role="tab" data-toggle="tab" draggable="false">统计信息</a>
                    </li>
                    <li role="presentation">
                        <a href="#contact" aria-controls="contact" role="tab" data-toggle="tab"
                           draggable="false">联系站长</a>
                    </li>
                </ul>
                <div class="tab-content">
                    <div role="tabpanel" class="tab-pane contact active" id="notice">
                        <h2>博客总数:
                            888篇
                        </h2>
                        <h2>网站运行:
                            <span id="sitetime">88天 </span></h2>
                    </div>
                    <div role="tabpanel" class="tab-pane contact" id="contact">
                        <h2>QQ:
                            <a href="" target="_blank" rel="nofollow" data-toggle="tooltip" data-placement="bottom"
                               title="" draggable="false" data-original-title="QQ:577211782">577211782</a>
                        </h2>
                        <h2>Email:
                            <a href="mailto:577211782@qq.com" target="_blank" data-toggle="tooltip" rel="nofollow"
                               data-placement="bottom" title="" draggable="false"
                               data-original-title="Email:577211782@qq.com">577211782@qq.com</a></h2>
                    </div>
                </div>
            </div>
            <div class="widget widget_search">
                <form class="navbar-form" th:action="@{/Search}" method="post">
                    <div class="input-group">
                        <input type="text" name="articletitle" class="form-control" size="35" placeholder="请输入关键字"
                               maxlength="15" autocomplete="off">
                        <span class="input-group-btn">
		                            <button class="btn btn-default btn-search" name="search" type="submit">搜索</button>
	                        	</span></div>
                </form>
            </div>
        </div>
        <div class="widget widget_hot">
            <h3>最新评论文章</h3>
            <ul>
                <li>
                    <a title="用DTcms做一个独立博客网站（响应式模板）" href="#"><span class="thumbnail">
<img class="thumb" data-original="images/201610181739277776.jpg" src="images/201610181739277776.jpg"
     alt="用DTcms做一个独立博客网站（响应式模板）" style="display: block;">
</span><span class="text">用DTcms做一个独立博客网站（响应式模板）</span><span class="muted"><i class="glyphicon glyphicon-time"></i>
2016-11-01
</span><span class="muted"><i class="glyphicon glyphicon-eye-open"></i>88</span></a>
                </li>
            </ul>
        </div>
        <div class="widget widget_sentence">

            <a href="#" target="_blank" rel="nofollow" title="专业网站建设">
                <img style="width: 100%" src="images/201610241224221511.jpg" alt="专业网站建设"></a>

        </div>
    </aside>
</section>
<footer class="footer">
    <div id="gotop">
        <a class="gotop"></a>
    </div>
</footer>
<script th:src="@{/blog/js/bootstrap.min.js}"></script>
<script th:src="@{/blog/js/jquery.ias.js}"></script>
<script th:src="@{/blog/js/scripts.js}"></script>
</body>

</html>